import React from 'react';
import { connect } from 'dva';
import SideBoard from '@/components/SideBoard';
import CardBox from '@/components/CardBox';
import GuassBox from '@/components/GuassBox';
import styles from './index.less';

const IndexPage = (props) => {
  const { cardData } = props;
  const { centerImage } = cardData;
  
  return (
    <div className={styles['app']}>
      <div className={styles['card-box']}>
        <GuassBox bgUrl={centerImage}><CardBox /></GuassBox>
      </div>
      <div className={styles['card-form']}>
        <SideBoard />
      </div>
    </div>
  );
}

const mapStateToProps = ({ cardData }) => {
  return {
    cardData,
  }
};

export default connect(mapStateToProps)(IndexPage);
